<script setup lang="ts">
  import { PropType, watch, ref } from "vue";
  import { ElForm, ElFormItem, FormInstance } from "element-plus";
  import SelectBase from "@/components/SelectBase.vue";
  const
    props = defineProps({
      modelValue: { type: Object as PropType<gt.sql.transfer>, default: format.def.transfer, },
      disabled: { type: Boolean, default: false }
    }),
    rules = ref({
      name: { required: true, message: "名称2-20个字符", trigger: "blur", min: 2, max: 20, },
      create: { required: true, message: "请选择转账用户", trigger: "blur", },
    }),
    entity = ref<FormInstance>();
  async function init() {

  }
  watch(() => props, init, { deep: true, immediate: true });

  defineExpose({
    validate() {
      return new Promise<boolean>((resolve) => {
        if (entity.value) {
          entity.value.validate().then(resolve).catch(() => { resolve(false); });
        } else {
          resolve(false);
        }
      });
    },
    resetFields() { entity.value?.resetFields(); }
  });
</script>
<template>
  <ElForm class="user xw zb" ref="entity" :model="modelValue" :rules="rules" labelWidth="6em">
    <ElFormItem label="id" prop="id">
      <el-input v-model="modelValue.id" disabled placeholder="系统自动生成" />
    </ElFormItem>
    <ElFormItem label="创建时间" prop="createTime">
      <el-input :modelValue="modelValue.createTime ? modelValue._createTime : '系统自动生成'" disabled />
    </ElFormItem>
    <ElFormItem label="类型" prop="type">
      <el-input v-model="modelValue.type" disabled />
    </ElFormItem>
    <ElFormItem label="转账用户" prop="create">
      <!-- <el-input :modelValue="modelValue._create.name" placeholder="请选择转账用户" :disabled="disabled" @click="selectUser" /> -->
      <SelectBase v-model="modelValue.create" type="user" :disabled="disabled" />
    </ElFormItem>
    <ElFormItem label="转账名称" prop="name">
      <el-input v-model="modelValue.name" placeholder="请输入名称" :disabled="disabled" />
    </ElFormItem>
    <ElFormItem label="备注" prop="des">
      <el-input v-model="modelValue.des" placeholder="请输入备注" :disabled="disabled" />
    </ElFormItem>
    <ElFormItem label="转账金额(单位：分)" prop="money" labelWidth="10em" class="wf">
      <el-input-number v-model="modelValue.money" placeholder="请输入转账金额" :disabled="disabled" :min="10" :max="200000"
        :step="10" />
    </ElFormItem>

  </ElForm>
</template>
<style lang="scss" scoped>
  .user {
    position: relative;
    >:not(.wf) {
      width: 49%;
    }
  }
</style>